// Color variable
$purple: #7D74FF
$blue: #53ECFF
$cyan-blue: #3DF7FF
$green: #48CF73
$powder: #FF4565
$white: #fff
$black: #000

.LoginBox
  position: absolute
  top: 22.5%
  left: 40%
  margin: 0
  opacity: 1
  z-index: 1
  transition: 0.5s

  .submitButton
    margin: 30px 0 0
    padding: 10px 80px
    position: relative
    top: 10px
    left: 5%


.RegisterBox
  position: absolute
  top: 15%
  left: 40%
  margin: 0
  opacity: 0
  z-index: 0
  transition: 0.5s

  .submitButton
    margin: 30px 0 0
    padding: 10px 80px
    position: relative
    top: 10px
    left: 2.5%


.LoginBox, .RegisterBox

  .moduleBox
    padding: 50px

  .moduleTitle
    margin: 0 0 40px
    position: relative
    font-size: 30px
    top: -5px

  .inputBox
    margin-left: 0

    h3
      font-size: 18px

    input
      width: 85%

    .input
      margin-right: 0
      margin-bottom: 30px

  .changeButton
    float: right
    color: $black
    transition: 0.3s

    &:hover
      color: $purple

    span
      margin-right: 5px
